import React from 'react';
import {Table,Icon,Tag,Button} from 'element-react';
import {connect} from 'react-redux'
import {getdata,add,reduce,remove} from '../action/cart'
import QueueAnim from 'rc-queue-anim';
import { Link } from 'react-router-dom'
import { Row, Col } from 'antd'
import { Modal } from 'antd'
import {Header} from '../Components'
import configureStore from './../store';
let {store,persistor} = configureStore();

 class Cart extends React.Component{

  constructor(props){
    super(props)
  }

    componentWillMount(){
      console.log('aaaaa',this.props)
      
    }

    add=(e)=>{
      this.props.add(e.target.getAttribute("data-id"))
    }

    reduce=(e)=>{
      this.props.reduce(e.target.getAttribute("data-id"))
    }

    remove=(e)=>{
      this.props.remove(e.target.getAttribute("data-id"))
    }
  
      
    render(){
        console.log('proid',this.props);
        // var productId = this.props;
        return(
            <div className="container">            
              <div className="total">
                  <div onClick={this.clearproduct} className="fl total-clear">
                    清空
                  </div>
                  <div className="fr total-all" onClick={this.showModal}>
                    去结算
                  </div>
                  <div className="fr total-font">
                    <span className="total-symbol">&nbsp;￥</span>
                    {(function(){
                      var sum = 0
                      for(var i =0;i<productId.length;i++){
                        var id = productId[i].productId
                          sum+=productId[i].price*quantityId[id]
                      }
                      
                      return sum.toFixed(2)
                    })()}
                  </div>
                </div>
                <Modal title="提示框"
                      onOk={this.handleOk} onCancel={this.handleCancel}
                >
                  <h5>确认购买？</h5>
                  <p>（购买后请到购买记录查看）</p>
                </Modal>
          </div>
        )
    }
}

const mapStateToProps = state=>{ 
  console.log(3333,state) 
  return{
      ...state
  }
}
// export default Product;
export default connect(mapStateToProps,{getdata,add,reduce,remove})(Cart);